<template>
    <div>
   <el-row>
  <el-col :span="6" v-for="(o, index) in productList" :key="o.id" :offset="index > 0 ? 2 : 0">
    <el-card :body-style="{ padding: '0px' }">
      <img :src="o.img" class="image">
      <div style="padding: 14px;">
        <span>{{o.name}}</span>
        <div class="bottom clearfix">
          <div>{{o.price}}</div>
          <time class="time">{{ o.createDate }}</time>
          <el-button type="text" class="button">操作按钮</el-button>
        </div>
      </div>
    </el-card>
  </el-col>
</el-row>
    </div>
</template>

<script>
import axios  from 'axios';
import qs from 'qs';

export default {
    name:'Product',
    data(){
        return {
            productList:['红烧猪蹄','盘龙茄子'],
            form:{
                name:'猪',
                price:10
            },
            currentDate:''
            }
    },
    mounted(){
        axios.post('http://localhost:10086/getProducts',qs.stringify(this.form))
        .then(resp=>{
            this.productList=resp.data.data;
        })
        .catch(err=>{console.log(err)});
    }
}
</script>

<style scoped>

</style>